<div class="layui-fluid" id="VIEW-CAPITAL" lay-title="账目统计">

    <!-- 表头条件搜索 -->
    <div class="layui-card">
        <div class="layui-card-header">
            <i class="layui-icon layui-icon-cluster"></i>&nbsp;账目统计
        </div>
        <div class="layui-row">
            <div class="layui-card-body">
                <div class="layui-form" id="capitalReload">
                    <div class="layui-input-inline" style="width:130px">
                        <input type="hidden" id="requestSource" name="requestSource" value="1">
                        <input type="text" name="content" id="content"
                               placeholder="摘要" autocomplete="off" class="layui-input">
                    </div>
                    <div class="layui-input-inline" style="width:130px">
                        <select name="capitalType" id="capitalType" lay-verify="required" lay-filter="capitalTypeFilter">
                            <option value="">-用途-</option>
                        </select>
                    </div>
                    <div class="layui-input-inline" style="width:130px">
                        <select name="inOrOut" id="inOrOut" >
                            <option value="">-收入/支出-</option>
                            <option value=false>支出</option>
                            <option value=true>收入</option>
                        </select>
                    </div>
                    <div class="layui-input-inline" style="width:130px">
                        <select name="accountType" id="accountType" lay-verify="required" lay-filter="accountTypeFilter">
                            <option value="">-结算方式-</option>
                        </select>
                    </div>
                    <div class="layui-input-inline" style="width:130px">
                        <select name="source" id="source" lay-verify="required" lay-filter="sourceFilter">
                            <option value="">-资金渠道-</option>
                        </select>
                    </div>
                    <div class="layui-input-inline" style="width:130px">
                        <input type="text" class="layui-input" name="cycleTime" id="cycleTime" placeholder="统计周期">
                    </div>

                    <div class="layui-input-inline" >
                        <button class="layui-btn" style="margin-left:20px;" onclick="reloadCapitalTable()">
                            <i class="layui-icon layui-icon-search"></i> 搜索
                        </button>
                    </div>
                    <div class="layui-input-inline">
                        <button class="layui-btn" style="margin-left:20px;" onclick="reloadCapitalTable(exportCapitalRecord)">
                            <i class="layui-icon layui-icon-cloud-download"></i>导出
                        </button>
                    </div>
                </div>

                <table id="capitalrepo-table" class="layui-hide" lay-filter="capitalrepo-table"></table>
            </div>
        </div>
    </div>
</div>
<script>
    layui.use(['admin', 'table', 'form', 'dropdown', 'jquery','laydate',"fileDownloadHelper"],
        function (admin, table, form, dropdown, $) {
            var laydate = layui.laydate,
                form = layui.form,
                admin = layui.admin,
                index;
            layer.ready(function () {
                setTimeout(function(){
                    setTrColor();
                },300);
            });
            var fileDownloadHelper = layui.fileDownloadHelper;

            // 导出数据文件
            exportCapitalRecord = function (params) {
                admin.get({
                    api: "exportCapitalRecord",
                    data:params,
                    //请求成功
                    success:function(res){
                        t = {
                            api: "fileDownload",
                            data: {
                                id:res.data
                            }
                        };
                        fileDownloadHelper.downloadFile(t);
                    }
                });
            };

            reloadCapitalTable = function(callbackFun) {

                var   requestSourceFilterVal = $("#requestSource").val() || null;
                var   contentFilterVal = $("#content").val() || null;
                var   capitalTypeFilter =$("#capitalType").val() || null;
                var   inOrOutFilterVal =$("#inOrOut").val() || null;
                var   accountTypeFilterVal =$("#accountType").val() || null;
                var   sourceFilterVal =$("#source").val() || null;
                var   cycleTimeFilterVal =$("#cycleTime").val() || null;

                var startTime = null;
                var endTime = null;
                if (cycleTimeFilterVal != null) {
                    startTime = cycleTimeFilterVal.substr(0, 19);
                    endTime = cycleTimeFilterVal.substr(22, 19);
                }
                var queryData = {
                    requestSource: requestSourceFilterVal,
                    content: contentFilterVal,
                    capitalType: capitalTypeFilter,
                    inOrOut: inOrOutFilterVal,
                    startTime: startTime,
                    endTime: endTime,
                    accountType: accountTypeFilterVal,
                    source: sourceFilterVal
                };
                var queryTemp = {};
                Object.keys(queryData).forEach(function(val, index) {
                    if (queryData[val] != null) queryTemp[val] = queryData[val];
                });

                console.log(queryTemp);
                tableIns.reload({
                    api: 'getAllCapitalDetail',
                    where: queryTemp
                });

                setTimeout(function(){
                    setTrColor();
                },300);

                if (callbackFun != undefined) {
                    callbackFun(queryTemp);
                }

            };




            //渲染数据字典下拉 {事项类型  资金渠道   账户类型}
            admin.get({
                api: "getDictValue",
                data:{
                    "dictCode" : "capitalType",
                },
                //请求成功
                success:function(res){
                    $.each(res.data, function (index, item) {
                        $('#capitalType').append(new Option(item.key, item.value));// 下拉菜单里添加元素

                    });
                    //重新渲染 固定写法
                    layui.form.render("select");
                }
            });
            admin.get({
                api: "getDictValue",
                data:{
                    "dictCode" : "settlementSource",
                },
                //请求成功
                success:function(res){
                    $.each(res.data, function (index, item) {
                        $('#source').append(new Option(item.key, item.value));// 下拉菜单里添加元素
                    });
                    //重新渲染 固定写法
                    layui.form.render("select");
                }
            });
            admin.get({
                api: "getDictValue",
                data:{
                    "dictCode" : "accountType",
                },
                //请求成功
                success:function(res){
                    $.each(res.data, function (index, item) {
                        $('#accountType').append(new Option(item.key, item.value));// 下拉菜单里添加元素
                    });
                    //重新渲染 固定写法
                    layui.form.render("select");
                }
            });
            //渲染表格实例
            var tableIns = table.render({
                elem: '#capitalrepo-table'
                ,height: 'full-165'
                ,api: 'getAllCapitalDetail' //数据接口
                ,where: {requestSource: $("#requestSource").val()}
                ,title: '资金明细查询'
                ,page: true //开启分页
                ,even: false //开启隔行背景
                ,parseData: function(res){ //res 即为原始返回的数据
                    return {
                        "code": res.code, //解析接口状态
                        "msg": res.message, //解析提示文本
                        "count": res.data.total, //解析数据长度
                        "data": res.data.records //解析数据列表
                    };
                }

                ,cols: [[ //表头
                    { title: '', type: 'checkbox', fixed: true, width: 60 },

                    {field: 'financeId', width: 0},
                    { title: '发生时间',field: 'createTime', width: 150 ,templet: function(d){
                            return (d.createTime).replace("T"," ");
                        },},
                    { title: '摘要', field: 'content', width: 300},
                    { field: 'capitalType', width: 0},
                    { title: '用途', field: 'capitalTypeToString', width: 90},
                    { title: '收入/支出', field: 'inOrOut', width: 90,templet: function(d){
                            if(d.inOrOut){
                                return "<span class=\"layui-badge layui-bg-green\">收入</span>";
                            }else{
                                return  "<span class=\"layui-badge layui-bg-orange\">支出</span>";
                            }
                        }},
                    { title: '收/支金额(元)', field: 'amountOfMoney', width: 120,templet: function(d){
                            if(d.inOrOut){
                                return d.amountOfMoney;
                            }else{
                                return  Math.abs(d.amountOfMoney);
                            }
                        }},
                    { field: 'accountType', width: 0 },
                    { title: '结算方式', field: 'accountTypeToString', width: 80 ,templet: function(d){
                            if(d.accountTypeToString=="公帐"){
                                return "<span class=\"layui-badge layui-bg-green\">公帐</span>";
                            }else if(d.accountTypeToString=="私帐"){
                                return  "<span class=\"layui-badge layui-bg-blue\">私帐</span>";
                            }else if(d.accountTypeToString=="现金"){
                                return  "<span class=\"layui-badge\">现金</span>";
                            }
                        }},
                    {field: 'source', width: 0 },
                    { title: '资金渠道', field: 'sourceToString', width: 110 },
                    { title: '渠道结余资金(元)', field: 'surplus', width: 150 },
                    { title: '所有结余资金(元)', field: 'allSurplus', width: 150 },

                    { title: '是否开发票', field: 'haveBill', width: 120 ,templet: function(d){
                            if(d.haveBill){
                                return "<span class=\"layui-badge layui-bg-green\">是</span>";
                            }else{
                                return  "<span class=\"layui-badge layui-bg-red\">否</span>";
                            }
                        }},
                    {field: 'billType', width: 0 },
                    { title: '发票类型', field: 'billTypeToString', width: 150 },
                    { title: '开票日期', field: 'createBillTime', width: 150 ,templet: function(d){
                            if(d.createBillTime!=null){
                                return (d.createBillTime).replace("T"," ");
                            }else{
                                return " ";
                            }

                        },},
                    { title: '收票日期', field: 'receiveBillTime', width: 150 ,templet: function(d){
                            if(d.receiveBillTime!=null){
                                return (d.receiveBillTime).replace("T"," ");
                            }else{
                                return " ";
                            }
                        },},
                    { title: '发票号', field: 'billNo', width: 150 },
                    { title: '开票金额(元)', field: 'billMoney', width: 150 },

                    { title: '备注', field: 'comment', minWidth: 130},
                    { title: '创建人',field: 'createName', width: 130 },
                    { title: '修改时间', field: 'modifyTime', width: 150 ,templet: function(d){
                            if(d.modifyTime!=null){
                                return (d.modifyTime).replace("T"," ");
                            }else{
                                return "";
                            }
                        },},
                    { title: '修改人', field: 'updateName', width: 100 },

                ]],done: function(res, curr, count){
                    $("[data-field='financeId']").css('display','none');
                    $("[data-field='capitalType']").css('display','none');
                    $("[data-field='accountType']").css('display','none');
                    $("[data-field='source']").css('display','none');
                    $("[data-field='billType']").css('display','none');

                }
            });

            function setTrColor(){
                $(".layui-table").each(function(){
                    $(this).find("tr").each(function () {
                        var open = $(this).find('td[data-field="haveBill"]').attr('data-content');
                        if(open=="false"){   //给状态为false的数据行设置背景色
                            $(this).css('background',"#fff000");
                        }
                    });
                })

            }
            form.render();
            laydate.render({
                elem: '#createTime_find'
                ,type: 'datetime'
                ,range: true
            });
        })
</script>